<template>
	<div class="fans">
		<ul class="terch-list clear" v-loading="loading">
			<li class="terch-list-i fans-list fl" v-for="item of fansList" :key="item.id">
				<div class="terch-list-i-h">
					<div class="box">
						<img :src="BASE_URL+item.avatar_path">
					</div>
					<div>{{item.name}}</div>
					<template>
						<div v-if="item.sub_name !== '暂未绑定科目' ">{{item.sub_name}}</div>
						<div v-else class="terch-list-i-pl"></div>
					</template>
				</div>
				<div class="terch-list-i-t">
					<div>{{item.name}}</div>
					<template>
						<div v-if="item.sub_name !== '暂未绑定科目' ">{{item.sub_name}}</div>
						<div v-else class="terch-list-i-pl"></div>
					</template>
					<template>
						<div v-if="item.autograph">{{item.autograph}}</div>
						<div v-else class="terch-list-i-pl">Hi</div>
					</template>
					<div>
						<i class="ipng but_maino1_slide" @click="spaceRoutr(item.id)"></i>
						<template v-if="$route.query.id == $g.user_id">
							
							<i class="ipng but_Collection02_slide"  v-if="item.is_relation === 0" @click="getFollow(item.id,'add')"></i>
							<i class="ipng but_Collection02_down" v-else @click="getFollow(item.id, 'del')"></i>
						</template>
						<!-- <template v-else>
							<i class="ipng but_Collection02_slide" v-if="item.is_relation === 0"></i>
							<i class="ipng but_Collection02_down" v-else></i>
						</template> -->
						<i class="ipng but_chat02_slide" @click="parent(item)"></i>
					</div>
				</div>
			</li>
		</ul>
		<el-pagination v-if="total_sum > page_size"
			class="pageing"
			@size-change="SizeChange"
			:current-page="page_index"
			:page-size="page_size"
			layout="total, prev, pager, next"
			:total="total_sum">
		</el-pagination>

		<!--  -->
		<div class="dependent" v-if="placeholder">
			<i class="ipng image_state01"></i>
			<p>还没发现任何相关的内容哦~</p>
		</div>

		<!-- <chat  ref="child"></chat> -->
	</div>
</template>
<script>
	// import chat from '@/components/common/chat';
	export default {
		// components: {chat},
		data(){
			return {
				page_index: 1,
				page_size: 12,
				total_sum: 10,
				fansList: [],
				placeholder: false,
				loading: true,
				is_newlogin:  is_empty(this.$store.state.userInfo) ? false : true,
			}
		},
		created(){
			this.getfansList()

		},
		methods: {
			parent(obj){

				if (!this.is_newlogin) {
					this.$message.warning('请登录~')
					return
				}
				if (obj.id == this.$g.user_id || obj.user_id == this.$g.user_id) {
					this.$message.warning('不能跟自己通讯哦~')
					return
				}

				for (var i = 0; i < this.$parent.$children.length; i++) {
					if (this.$parent.$children[i].$el.className === 'chat-emoji') {
						this.$parent.$children[i].getUserChatOne(obj)
						break
					}
					
				}
			},
			getfansList(){
				let success = (res =>{
					this.fansList = res.data.data;
					this.total_sum = parseInt(res.data.data_sum)

					this.loading = false
					this.placeholder = this.fansList.length === 0 ? true : false
				});
				this.$ajax({
					url: 'api/user/relation',
					method: 'get',
					params: {
						page: this.page_index,
						size: this.page_size,
						user_id:this.$route.query.id,
						type: 0,
						data_type: 2,
						is_diffplat: 1
					},
					func: {success: success}
				})
			},
			getFollow(id, type){
				if (!this.is_newlogin) {
					this.$message.warning('请登录~')
					return
				}
				let success = ( res =>{
					this.$message.success(res.msg);
					this.getfansList()
				});

				let state = ''
				if (type == 'add') {
					state = 'add'
				}else{
					state = 'del'
				}

				this.$ajax({
					url: 'api/user/bind_relation',
					method: 'post',
					data: {
						user_id:  this.$route.query.id,
						follow_id: id,
						add_delete: state,
						type: 0
					},
					func: {
						success: success
					}
				})
			},
			spaceRoutr(id){
				let host_addr = sessionStorage.getItem('host_addr');
				let host = host_addr.split('://')[1];
				let token = sessionStorage.getItem('redirect_params');
				let url = `${host_addr}${token}&host=${host}&routerUrl=/space&id=${id}&CheckSchoolAppCode=${sessionStorage.getItem('CheckSchoolAppCode')}`
				window.open(url)
			},
			SizeChange(val) {
				this.page_index = val;
				this.getfansList()
			}
		},
	}
</script>